<template>
  <view class="item-list df fdr fww jc-sb">
    <view
      class="item u-rela"
      v-for="(item, index) in list"
      :key="index"
      @click.stop="
        jump(`/views/goods/goods_detail?goods_id=${item.goods_id || item.order_goods_id}`, true)
      "
    >
      <image class="pic" :src="item.goods_image"></image>
      <image v-if="url" class="label-icon" :src="url" mode="widthFix"></image>
      <view class="info">
        <view class="u-line-2 name">{{ item.goods_name }}</view>
        <view class="red-color font-20">可获得{{ item.block_coin }}街区币</view>
        <view class="df fdr alc f24 jc-sb">
          <view class="font-20 gray-color">月销{{ item.sale_num }}</view>
          <view class="u-m-r-8">
            <!-- 价格 -->
            <text class="f24 font-weight-500 red-color"
              >￥<text class="font-44 lh-44 font-weight-700">{{ item.price }}</text></text
            >
            <!-- 划线价 -->
            <text class="cost-price"></text>
          </view>
        </view>
      </view>
      <!-- 提示文字 -->
      <!-- <view class="prompt-box" v-if="prompt">{{ prompt }}</view> -->
    </view>
  </view>
</template>

<script>
  export default {
    props: {
      list: {
        type: Array,
        default: () => [],
      },
      prompt: {
        type: String,
        default: '',
      },
      url: {
        type: String,
        default: '',
      },
    },
    data() {
      return {
        keyword: '',
      }
    },
  }
</script>

<style scoped lang="scss">
  .item-list {
    .item {
      position: relative;
      width: 48.3%;
      margin-bottom: 30rpx;
      overflow: hidden;
      background: rgba(255, 255, 255, 1);
      border: 2rpx solid transparent;
      border-radius: 8rpx;
      box-shadow: 0 6rpx 40rpx 0 rgba(0, 0, 0, 0.05);
    }

    .active {
      border: 2rpx solid var(--color);
    }

    .item:nth-child(2n) {
      margin-right: 0;
    }

    .pic {
      width: 100%;
      height: 338rpx;
    }

    .info {
      padding: 14rpx 20rpx 22rpx;
    }

    .name {
      width: 278rpx;
      height: 76rpx;
      margin-bottom: 10rpx;
    }

    .cost-price {
      text-decoration: line-through;
    }
  }
</style>
